<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="path" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户注册</title>
    <script src="${path}/user/test02/jquery-3.6.0.js"></script>
    <link rel="stylesheet" href="${path}/user/test02/css/register.css">
</head>
<body>
<jsp:include page="${path}/user/test03/normal/head.jsp"></jsp:include>
	<table width="950" align="center" border="0" cellspacing="0" cellpadding="0" class="tabbj">
        <tbody><tr><td>
    <form name="aspnetForm" method="post" action="${path}/UserServlet?mark=userRegister" id="aspnetForm">
        <table width="950" align="center" border="0" cellspacing="0" cellpadding="0" class="tabbj">
          <tbody><tr>
            <td align="center" style="padding:5px;"><table width="100%" height="85" border="0" cellpadding="0" cellspacing="0" style="border:1px solid #BBCADE">
              <tbody><tr>
                <td style="font-size:14px;">
        		<div class="reg_headline">
                        <h2>新用户注册</h2>
                        
                        <div class="reg_subtitle"><strong>欢迎加入</strong><br>
                      <span style="font-size:12px">马上开始累积积分，换取丰厚奖励，享受品质服务！</span></div>
                        
                    </div>
                     
                    <div class="reg_boxes">
                  <table width="75%" border="0" cellspacing="0" cellpadding="0" class="reg_tablelist">
                            <tbody>
                            <tr><td colspan="3"><span style="color: red;">${eorr}</span></td></tr>
                            <tr>
                                <td width="100" align="right" valign="top"><span class="base_warning">*</span>用户名</td>
                                <td width="180" valign="top"><input name="userId" type="text" id="signup_uname" class="reg_inputxt" placeholder="请输入用户名" maxlength="20"></td>
                                
                                <td align="left" valign="top"><span class="reg_info" id="chk_signup_username"></span></td>
                                
                            </tr>
                            <tr>
                                <td align="right" valign="top"><span class="base_warning">*</span>密&nbsp;&nbsp;码</td>
                                <td valign="top" style="width: 170px;"><input name="pwd" type="password" id="signup_pwd" placeholder="请输入密码" class="reg_inputxt" maxlength="50"></td>
                                
                                <td align="left" valign="top"><span class="reg_info" id="chk_signup_pwd"></span></td>
                                
                            </tr>
                            <tr>
                                <td align="right" valign="top"><span class="base_warning">*</span>确认密码</td>
        
                                <td valign="top"><input name="pwd2" type="password" id="signup_pwd2" placeholder="请再次输入密码。" class="reg_inputxt" maxlength="50"></td>
                                <td align="left" valign="top"><span class="reg_info" id="chk_signup_pwd2"></span></td>
                            </tr>
                            <tr>
                                <td align="right" valign="top"><span class="base_warning">*</span>身份证</td>
                                <td valign="top"><input name="IDCar" type="text" id="signup_IDCar" class="reg_inputxt" autocomplete="off"></td>
                                <td align="left" valign="top">
									<!-- <img width="100" height="22" align="absmiddle" alt="看不清楚请点击刷新" id="checkCode_img" src="/ValidateCode.aspx" onclick="javascript:getcheckcode(this);"> -->
									<span class="reg_info" id="checkCode_text"></span></td>
        
                            </tr>
                            <tr>
                                <td align="right" valign="top"><span class="base_warning">*</span>手机号码</td>
                                <td valign="top"><input name="phone" type="text" id="phone" class="reg_inputxt" maxlength="20"></td>
                                <td align="left" valign="top"><span class="reg_info" id="chk_signup_mobilephone">请正确填写您的手机号码，以便我们确认您的预订服务。</span></td>
                            </tr>
							<tr>
                                <td width="75" align="right"><span class="base_warning">*</span>姓&nbsp;&nbsp;名</td>
                                <td width="184"><input name="name" type="text" id="signup_name" placeholder="请填写您的真实姓名" class="reg_inputxt" maxlength="20"></td>
        
                                <td width="413"><span class="reg_info" id="chk_signup_name"></span></td>
                            </tr>
                            <tr>
                                <td width="75" align="right">性&nbsp;&nbsp;别</td>
                                <td width="184" align="left">&nbsp;&nbsp;
                                    <input value="男" name="sex" type="radio" id="signup_sex1" checked="checked">男
                                    <input value="女" name="sex" type="radio" id="ctl00_ContentPlaceHolder1_signup_sex2">女
                                </td>
                                <td width="413">&nbsp;</td>
                            </tr>
                            <tr>
                                <td width="75" align="right"><span class="base_warning">*</span>年&nbsp;&nbsp;龄</td>
                                <td width="184" align="left">&nbsp;&nbsp;
                                    <input value="18" name="age" type="number" min="1" max="150" id="signup_age" style="width: 30px;" >
                                </td>
                                <td width="413">&nbsp;</td>
                            </tr>
                            <tr>
                                <td align="right"><span class="base_warning">*</span>家庭地址</td>
                                <td><input name="addr" type="text" id="signup_addr" class="reg_inputxt" maxlength="200"></td>
                                <td><span class="reg_info" id="chk_signup_addr"></span></td>
                            </tr>	
                      </tbody></table>
                    </div>
                    <div class="reg_btnbox">
                        <!-- <input type="button" name="signup_submit" value="提交注册" onclick="this.style.display='none';$('loadid').style.display='';" id="signup_submit" class="base_btn07">&nbsp;<span id="loadid" style="display:none">请稍等....</span></div></td> -->
						<input type="button" name="signup_submit" value="提交注册"  id="signup_submit" class="base_btn07"></div></td>
                    
              </tr>
            </tbody></table>
		</td>
          </tr>
        </tbody></table>
         </form>
		 </td></tr></tbody></table>
		 <script>
			 $(function(){
				var flag=true;
				// $('#signup_pwd').blur(function(){
				// 	var pwd1=$('#signup_pwd').val();
				// 	if(pwd1.replace(/[]/g,'').length==0){
				// 		alert('密码不能为空');
				// 		flag=false;
				// 		return;
				// 	}
				// 	if(pwd1.length<7){
				// 		alert('密码长度不能小于7位');
				// 		flag=false;
				// 		return;
				// 	}
				// 	flag=true;
				// });

				//密码与确认密码是否相同
				$('#signup_pwd2').blur(function(){
					var pwd1=$('#signup_pwd').val();
					var pwd2=$(this).val();
					if(pwd1.replace(/[]/g,'').length==0){
						$('#chk_signup_pwd2').text('密码不能为空');
						$('#chk_signup_pwd2').attr('style','color:red;');

						flag=false;
						return;
					}
					if(!(pwd1==pwd2)){
						$('#chk_signup_pwd2').text('确认密码要与密码一致');
						$('#chk_signup_pwd2').attr('style','color:red;');
						flag=false;
					}else{
						$('#chk_signup_pwd2').text('');
						flag=true;
					}
					
				});

				//手机号码验证
				$('#phone').blur(function(){
					var phone=$(this).val();
					if(!(/^1(3[0-9]|4[5,7]|5[0,1,2,3,5,6,7,8,9]|6[2,5,6,7]|7[0,1,7,8]|8[0-9]|9[1,8,9])\d{8}$/.test(phone))){ 
						$('#chk_signup_mobilephone').text('手机号码有误，请重填');
						$('#chk_signup_mobilephone').attr('style','color:red;');
						flag=false;
    				} else{
						$('#chk_signup_mobilephone').text('');
						flag=true;
					}
					
				});

				//表单是否可以提交
				$('#signup_submit').click(function(){
					var str ='';
				
					if($('#signup_uname').val().length==0){
						str+="用户名,";
					}
					if($('#signup_pwd').val().length==0){
						str+="密码,";
					}
					if($('#signup_pwd2').val().length==0){
						str+="确认密码";
					}
					if($('#signup_IDCar').val().length==0){
						str+="身份证,";
					}
					if($('#phone').val().length==0){
						str+="手机号码,";

					}
					if($('#signup_name').val().length==0){
						str+="姓名,";
					}
                    if($('#signup_addr').val().length==0){
                        str+="家庭地址,";
                        $('#chk_signup_addr').text('地址不能为空');
                        $('#chk_signup_addr').attr('style','color:red;');
                    }

					if(str.length>0){
						alert(str+'不能为空');
					}else if(!flag){
						alert('请检查其他信息输入是否有误');
					}else{
						$('#aspnetForm').submit();
					}
				});
                 $('#signup_age').blur(function () {
                     if($(this).val()<=0||$(this).val()>=150){
                         alert('年龄请输入大于1且小于150的数字');
                         $(this).val(${user.age});
                     }
                 });
			 });
		 </script>
<jsp:include page="${path}/user/test03/normal/footer.jsp"></jsp:include>
</body>
</html>